@gray: #333;
@color: #fff;

@color1: #4482ff;
@color2: #49b0ff;
@color3: #7680ff;
@color4: #8a5cfd;

@baseWidth: 720;
.px2rem(@atr,@px,@base-width:0) when( @base-width > 0){
	@{atr}: unit(@px*10/@base-width , rem);
}

.px2rem(@atr,@px,@base-width:0) when( @base-width = 0){
	@{atr}: unit(@px*10/@baseWidth , rem);
}

.Pro{
    display: flex;
    flex-wrap: wrap;
    .items{
        text-align: left;
        color: @color;
        box-sizing: border-box;
        .px2rem(border-radius, 12);
        .px2rem(margin-top, 12);
        .px2rem(margin-bottom, 12);
        .px2rem(padding, 12);
        .px2rem(padding-top, 20);
        .px2rem(padding-bottom, 20);
        display: flex;
        background: -webkit-linear-gradient(right, #14c2ff, #4482ff);
        &:nth-child(4n-2){
            background: -webkit-linear-gradient(right, #4fd7ba, #35c6cd);
        }
        &:nth-child(4n-1){
            background: -webkit-linear-gradient(right, #a9abfa, #4482ff);
        }
        &:nth-child(4n){
            background: -webkit-linear-gradient(right, #14c2ff, #4482ff);
        }
        &.col-12{
            margin: 2%;
            width: 46%;
            flex: 0 0 auto;
            &:nth-child(2n){
                float: right;
            }
        }
        .icon{
            .px2rem(padding-right, 8);
            .px2rem(font-size, 62);
            .px2rem(height, 62);
        }
        .inner{
            flex: 1;
            .num{
                font-weight: normal;
                .px2rem(font-size, 28);
                .px2rem(line-height, 36);
            }
            .text{
                font-weight: normal;
                .px2rem(font-size, 22);
                .px2rem(line-height, 36);
                .px2rem(margin-bottom, 12);
                white-space: nowrap;
                text-overflow: ellipsis;
                overflow: hidden;
                display: flex;
                span{
                    .px2rem(font-size, 16);
                }
                b{
                    text-align: right;
                    flex: 1;
                }
            }
        }
    }
}

.list{
    display: flex;
    span{
        flex: 1;
        .px2rem(font-size, 18);
    }
}

